相对定位：position:relative
1、 指定了相对定位后，元素就是一个定位元素，脱离文档流，但没有完全脱离文档流；
2、 相对定位元素脱离了文档流，但原来的位置还得保留。
3、 相对定位是相对于原来的位置进行定位;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>css</title>
<style type="text/css">
.box{width:302px;height:302px;border:3px solid blue;margin:50px auto}
.pst1,.pst2,.pst3{width:100px;height:100px;color:white;font-size:30px;line-height:100px;text-align:center}
.pst1{background:green; }
.pst2{background:blue;
position:relative;
left:100px;
}
.pst3{background:orange;
position:relative;
left:200px;
}
</style>
</head>
<body>
<div class="box">
<div class="pst1">1</div>
<div class="pst2">2</div>
<div class="pst3">3</div>
</div>
</body>
</html>